<template>
    <div>
        <el-dialog v-model="props.publicDialog" title="
站点描述" width="660" @close="handleModificationClose">
            <el-tabs v-model="activeName" class="demo-tabs">
                <el-tab-pane v-for="item in publicItem" :key="item.languageId"
                    :label="sys_language_type.find(e => e.id === item.languageId)?.description" :name="item.languageId">
                    <el-form :model="item" label-width="auto"  label-position="left">
                        <el-form-item label="联系地址">
                            <el-input v-model="item.address" placeholder="请输入" maxlength="100"  type="textarea"
                                show-word-limit   :rows="3"
                                resize="none"/>
                        </el-form-item>
                        <el-form-item label="站点描述">
                            <el-input v-model="item.description" :rows="3" type="textarea" placeholder="请输入"
                                maxlength="300" show-word-limit />
                        </el-form-item>
                        <el-form-item label="SEO标题">
                            <el-input v-model="item.seoTitle" :rows="3" type="textarea" placeholder="请输入"
                                maxlength="300" show-word-limit />
                        </el-form-item>

                        <el-form-item label="站点SEO描述">
                            <el-input v-model="item.seoDescription" :rows="3" type="textarea" placeholder="请输入"
                                maxlength="300" show-word-limit />
                        </el-form-item>
                        <el-form-item label="站点SEO关键字">
                            <el-input v-model="item.seoKeyword" :rows="3" type="textarea" placeholder="请输入"
                                maxlength="300" show-word-limit />
                        </el-form-item>
                    </el-form>
                </el-tab-pane>
            </el-tabs>
            <template #footer>
                <el-button type="primary" @click="handleModificationSure">确 定 </el-button>
                <el-button @click="handleModificationClose">取 消</el-button>
            </template>
        </el-dialog>
    </div>
</template>
<script setup>
import { ref, defineProps, defineEmits, onMounted, watch, reactive } from "vue";
const { proxy } = getCurrentInstance();
const emits = defineEmits(["handleModificationClose", "handleModificationSure"]);
const sys_language_type = ref([])
const activeName = ref(null)
const props = defineProps({
    publicDialog: {
        type: Boolean,
        default: false,
    },
    publicItem: {
        type: Array,
        default: [],
    },
});
onMounted(() => {
    getLanguage()
})
const subFrom = ref({
    sys_language_default: []
})
watch(
    () => props.publicDialog,
    () => {
        if (!props.publicDialog) return;
        getBasicsDetails()
    })
const getBasicsDetails = () => {
    console.log(props.publicItem);
    activeName.value = props.publicItem[0]?.languageId

}
const handleModificationClose = () => {
    emits("handleModificationClose");
}
const handleModificationSure = () => {
    if (!proxy.publicArray(props.publicItem, 1)) return proxy.$modal.msgError("请完整填写站点描述")
    emits("handleModificationSure");
}
const getLanguage = () => {
    let from = {
        pageNum: 1,
        pageSize: 999,
        param: {},
    };
    product.language.languageList().then((res) => {
        sys_language_type.value = res.data;
    });
}
</script>